<template>
  <el-dialog :title="!dataForm.id ? '添加' : '编辑'" :close-on-click-modal="false" :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
    <el-steps :active="1" align-center>
      <el-step title="提交订单" description="2017-07-19 15:43:23"></el-step>
      <el-step title="支付订单" description="未支付"></el-step>
      <el-step title="平台发货" description=""></el-step>
      <el-step title="确认收货" description=""></el-step>
      <el-step title="完成评价" description=""></el-step>
    </el-steps>
    <div>
      <div>当前订单状态：待付款</div>
      <div>基本信息</div>
      <el-table
          :data="tableData"
          border
          style="width: 100%">
          <el-table-column
            prop="date"
            label="订单编号"
            width="180">
          </el-table-column>
          <el-table-column
            prop="name"
            label="发货单流水号"
            width="180">
          </el-table-column>
          <el-table-column
            prop="address"
            label="用户账号">
          </el-table-column>
          <el-table-column
            prop="address"
            label="支付方式">
          </el-table-column>
          <el-table-column
            prop="address"
            label="订单来源">
          </el-table-column>
          <el-table-column
            prop="address"
            label="订单类型">
          </el-table-column>
        </el-table>
        <el-table
            :data="tableData"
            border
            style="width: 100%">
            <el-table-column
              prop="date"
              label="配送方式"
              width="180">
            </el-table-column>
            <el-table-column
              prop="name"
              label="物流单号"
              width="180">
            </el-table-column>
            <el-table-column
              prop="address"
              label="自动确认收货时间">
            </el-table-column>
            <el-table-column
              prop="address"
              label="订单可得积分">
            </el-table-column>
            <el-table-column
              prop="address"
              label="活动信息">
            </el-table-column>
            <el-table-column
              prop="address"
              label="">
            </el-table-column>
          </el-table>
    </div>
    <div>收货人信息</div>
    <el-table
        :data="tableData"
        border
        style="width: 100%">
        <el-table-column
          prop="date"
          label="收货人"
          width="180">
        </el-table-column>
        <el-table-column
          prop="name"
          label="手机号码"
          width="180">
        </el-table-column>
        <el-table-column
          prop="address"
          label="邮政编码">
        </el-table-column>
        <el-table-column
          prop="address"
          label="收货地址">
        </el-table-column>
      </el-table>
      <div>商品信息</div>
      <el-table
          :data="tableData"
          border
          style="width: 100%">
          <el-table-column
            prop="date"
            label="商品图片"
            width="180">
          </el-table-column>
          <el-table-column
            prop="name"
            label="商品名称"
            width="180">
          </el-table-column>
          <el-table-column
            prop="address"
            label="价格/货号">
          </el-table-column>
          <el-table-column
            prop="address"
            label="属性">
          </el-table-column>
          <el-table-column
            prop="address"
            label="数量">
          </el-table-column>
          <el-table-column
            prop="address"
            label="库存">
          </el-table-column>
          <el-table-column
            prop="address"
            label="小计">
          </el-table-column>
        </el-table>
        <div>运费 <span>¥200.00</span> ，优惠 <span>¥200.00</span> 商品合计：<span>¥200.00</span>   </div>
    </el-form>
  </el-dialog>
</template>

<script>
  import {treeDataTranslate} from '@/utils'

  export default {
    data () {
      return {
        visible: false,
        dataForm: {
          id: '0'
        }

      }
    },

    methods: {
      init (id) {
        this.dataForm.id = id || 0
        this.visible = true
        // this.$nextTick(() => {
        //   this.$refs['dataForm'].resetFields()
        // })
      }
    }
  }
</script>

<style lang="scss">

</style>
